// 此文件为uView的主题变量，这些变量目前只能通过uni.scss引入才有效，另外由于
// uni.scss中引入的样式会同时混入到全局样式文件和单独每一个页面的样式中，造成微信程序包太大，
// 故uni.scss只建议放scss变量名相关样式，其他的样式可以通过main.js或者App.vue引入

// uview-plus 主题变量

// 主题色
$u-primary: #2979ff;
$u-primary-dark: darken($u-primary, 10%);
$u-primary-disabled: lighten($u-primary, 20%);
$u-primary-light: lighten($u-primary, 35%);

$u-warning: #ff9900;
$u-warning-dark: darken($u-warning, 10%);
$u-warning-disabled: lighten($u-warning, 20%);
$u-warning-light: lighten($u-warning, 35%);

$u-success: #19be6b;
$u-success-dark: darken($u-success, 10%);
$u-success-disabled: lighten($u-success, 20%);
$u-success-light: lighten($u-success, 35%);

$u-error: #fa3534;
$u-error-dark: darken($u-error, 10%);
$u-error-disabled: lighten($u-error, 20%);
$u-error-light: lighten($u-error, 35%);

$u-info: #909399;
$u-info-dark: darken($u-info, 10%);
$u-info-disabled: lighten($u-info, 20%);
$u-info-light: lighten($u-info, 35%);

// 文字颜色
$u-main-color: #303133;
$u-content-color: #606266;
$u-tips-color: #909399;
$u-light-color: #c0c4cc;

// 背景颜色
$u-bg-color: #f3f4f6;

// 边框颜色
$u-border-color: #e4e7ed;

// 禁用颜色
$u-disabled: #c8c9cc;

// 字体大小
$u-font-size-xs: 22rpx;
$u-font-size-sm: 24rpx;
$u-font-size-base: 26rpx;
$u-font-size-lg: 28rpx;
$u-font-size-xl: 30rpx;

// 图标大小
$u-icon-size-xs: 20rpx;
$u-icon-size-sm: 24rpx;
$u-icon-size-base: 28rpx;
$u-icon-size-lg: 32rpx;
$u-icon-size-xl: 36rpx;

// 边框圆角
$u-border-radius-sm: 4rpx;
$u-border-radius-base: 6rpx;
$u-border-radius-lg: 12rpx;
$u-border-radius-circle: 100rpx;

// 间距
$u-spacing-xs: 10rpx;
$u-spacing-sm: 20rpx;
$u-spacing-base: 30rpx;
$u-spacing-lg: 40rpx;
$u-spacing-xl: 50rpx;

// 透明度
$u-opacity-disabled: 0.3;

// 行高
$u-line-height-xs: 24rpx;
$u-line-height-sm: 26rpx;
$u-line-height-base: 28rpx;
$u-line-height-lg: 30rpx;
$u-line-height-xl: 32rpx;

// 文本大小
$u-text-size-xs: 20rpx;
$u-text-size-sm: 24rpx;
$u-text-size-base: 28rpx;
$u-text-size-lg: 32rpx;
$u-text-size-xl: 36rpx;

// 文本颜色
$u-text-color-primary: #2979ff;
$u-text-color-base: #606266;
$u-text-color-secondary: #909399;
$u-text-color-placeholder: #c0c4cc;
$u-text-color-disable: #c8c9cc;

// 背景色
$u-bg-color-primary: #ecf5ff;
$u-bg-color-warning: #fdf6ec;
$u-bg-color-success: #f5fff0;
$u-bg-color-error: #fef0f0;
$u-bg-color-info: #f4f4f5;

// 补充缺失的变量
$u-disabled-color: #c8c9cc;
$u-disabled-text-color: #c8c9cc;
$u-disabled-background-color: #f7f7f7;

// 补充其他可能会用到的变量
$u-form-item-height: 70rpx;
$u-form-item-border-color: #dcdfe6;
$u-form-item-disabled-color: #f5f7fa;

$u-button-height: 80rpx;
$u-button-loading-text-color: #fff;
$u-button-disabled-text-color: #fff;
$u-button-disabled-background-color: #f7f7f7;

$u-tabs-height: 80rpx;
$u-tabs-item-width: 200rpx;
$u-tabs-active-color: #2979ff;
$u-tabs-inactive-color: #606266;
$u-tabs-disabled-color: #c8c9cc;
$u-tabs-bar-height: 3px;

$u-tag-height: 40rpx;
$u-tag-text-color: #fff;
$u-tag-disabled-color: #c8c9cc;
$u-tag-disabled-background-color: #f7f7f7;

$u-loading-icon-color: #c8c9cc;
$u-loading-icon-text-color: #606266;

$u-switch-width: 100rpx;
$u-switch-height: 60rpx;
$u-switch-node-width: 60rpx;
$u-switch-node-height: 60rpx;
$u-switch-disabled-opacity: 0.4;

$u-dropdown-menu-height: 80rpx;
$u-dropdown-menu-item-height: 100rpx;
$u-dropdown-menu-active-text-color: #2979ff;
$u-dropdown-menu-inactive-text-color: #606266;
$u-dropdown-menu-disabled-text-color: #c8c9cc;

// 动画相关
$u-animation-duration: 0.25s;
$u-transition-duration: 0.3s;

// z-index层级
$u-z-index-popup: 10070;
$u-z-index-mask: 10070;
$u-z-index-loading: 10080;
$u-z-index-toast: 10090;

// scss混入，为了少写几行#ifndef
@mixin flex($direction: row) {
	/* #ifndef APP-NVUE */
	display: flex;
	/* #endif */
	flex-direction: $direction;
}

// 补充缺失的混入
@mixin disabled {
  opacity: $u-opacity-disabled !important;
  cursor: not-allowed !important;
}

@mixin ellipsis {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

@mixin flex-center {
  display: flex;
  align-items: center;
  justify-content: center;
}

@mixin flex-between {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
